<!doctype html>
<html>
  <head>
    <meta charset=utf-8>
    <title>Encrypted Media Extensions: setMediaKeys to multiple video elements with Clear Key</title>
    <link rel="help" href="https://w3c.github.io/encrypted-media/">

    <!-- Web Platform Test Harness scripts -->
    <script src=/resources/testharness.js></script>
    <script src=/resources/testharnessreport.js></script>

    <!-- Helper scripts for Encrypted Media Extensions tests  -->
    <script src=/encrypted-media/util/utils.js></script>
    <script src=/encrypted-media/util/utf8.js></script>
    <script src=/encrypted-media/util/fetch.js></script>

    <!-- Content metadata -->
    <script src=/encrypted-media/content/content-metadata.js></script>

    <!-- Message handler for Clear Key -->
    <script src=/encrypted-media/util/clearkey-messagehandler.js></script>

    <!-- The script for this specific test -->
    <script src=/encrypted-media/scripts/setmediakeys-to-multiple-video-elements.js></script>

  </head>
  <body>
    <div id='log'></div>

    <div id='video1'>
      <video id="videoelement1" width="200px"></video>
    </div>
    <div id='video2'>
      <video id="videoelement2" width="200px"></video>
    </div>

    <script>
        getSupportedContent( 'org.w3.clearkey' ).then( function( contents ) {
            runTest( {  video1:              document.getElementById('videoelement1'),
                        video2:              document.getElementById('videoelement2'),
                        keysystem:          'org.w3.clearkey',
                        content:            contents[ 0 ]
                     } );
        } );
    </script>
  </body>
</html>
